<template>
    <div>
        <!-- 导航栏 -->
        <van-nav-bar title="实训云平台" left-text="返回" right-text="首页" left-arrow @click-left="onClickLeft"
            @click-right="onClickRight" :fixed="true" :placeholder="true" :z-index="100" />

        <!-- 功能栏 -->
        <div>
            <van-dropdown-menu title="任务选择" active-color="#1989fa">
                <van-dropdown-item v-model="classId" :options="classInfos" @change="changeClass" />
            </van-dropdown-menu>
        </div>

        <!--列表展示位置-->
        <div v-show="show == 0" style="width:90%;margin: 10px auto;">
            <div v-for="(item, index) in resources" :item="item" :key="index">
                <van-cell :title="item.name" :label="item.resourceType == 0 ? '资源类型：文件' : item.resourceUrl"
                    @click="copyUrl(item)">
                    <van-tag v-show="item.resourceType == 0" type="primary" @click="downLoadFile(item.resourceUrl)">下载
                    </van-tag>
                </van-cell>
            </div>
        </div>
        <!-- 加载动画 -->
        <loading v-if="loadingStatus"></loading>
    </div>

</template>
<script>
import { Toast } from 'vant';
import req from '../../../request/request'
import { downloadFile } from '../../../request/MyFileReq'

export default {
    name: 'ResourcesInfo',
    data() {
        return {
            show: 0,
            // 加载动画
            loadingStatus: true,
            resources: '',
            showScore: false,
            show: 0,
            classInfos: [],
            classId: 1,
            showCalendar: false,
            name: '',
            endTime: '',
            content: '',
            tempItem: '',
            score: '',
        }
    },
    methods: {
        downLoadFile(url) {
            downloadFile('/api/downLoadFile', { 'url': url })
        },

        copyUrl(resource) {
            if (resource.resourceType == 1) {
                const ipt = document.createElement("input");
                ipt.value = resource.resourceUrl;
                document.body.appendChild(ipt);
                ipt.select();
                document.execCommand("Copy");
                ipt.remove();
                Toast('复制成功');
            }
        },

        getResourcesByClass() {
            req({
                url: "/getResourcesByClass",
                method: "POST",
                data: {
                    relationClassId: this.classId
                }
            }).then(res => {
                this.resources = res.data.data;
            }).catch(err => {
                // console.log(err);
            })
        },
        // 更改班级列表
        changeClass(res) {
            // console.log(res)
            for (var i = 0; i < this.classInfos.length; i++) {
                if (this.classInfos[i].value == res) {
                    this.practiceTitle = this.classInfos[i].text;
                    this.getResourcesByClass();
                }
            }

        },
        // 获取班级列表
        getTraining() {
            req({
                url: "getTraining",
                method: "POST",
                data: {
                    id: this.$store.state.user.id
                }
            }).then(res => {
                if (res.data.code == 0) {
                    var data = res.data.data;
                    this.classId = res.data.data[0].id;
                    this.practiceTitle = res.data.data[0].practiceTitle;
                    for (var i = 0; i < data.length; i++) {
                        var x = { text: '班级1', value: 0 };
                        x.text = data[i].practiceTitle;
                        x.value = data[i].id;
                        this.classInfos.push(x);
                    }
                    this.getResourcesByClass()
                }
            }).catch(err => {
                // console.log(err);
            })
        },
        onClickLeft() {
            if (this.show == 0) {
                this.$router.back(1)
                // console.log("返回首页")
            } else {
                // 返回上一级
                this.back();
            }
        },

        onClickRight() {
            // 回到首页
            this.$router.back(1)

        },
        // 返回方法
        back() {
            this.show = 0;
            this.getResourcesByClass()
            this.loadingStatus = true;
            setTimeout(async () => {
                this.loadingStatus = false;
            }, 500);
        },


    },
    computed: {
    },
    mounted() {
        //发送请求 获取该用户的所有班级信息
        this.getTraining();
        setTimeout(async () => {
            this.loadingStatus = false;
        }, 1000);

    },
}
</script>
<style>

</style>